<template>
    <div style="display:inline-block;padding:0 6px;">
        <Dropdown trigger="click" @on-click="handleSwitch">
            <a href="javascript:void(0)">
                <Icon :style="{marginTop: '-2px', verticalAlign: 'middle'}" color="#495060" :size="18" type="earth"></Icon>
                <Icon type="arrow-down-b"></Icon>
            </a>
            <DropdownMenu slot="list">
                <DropdownItem v-for="(item, index) in langList" :key="index" :name="item.name">
                    <Row type="flex" justify="center" align="middle">                        
                        <span>{{item.text}}</span>
                    </Row>
                </DropdownItem>
            </DropdownMenu>
        </Dropdown>
    </div>
</template>

<script>
import Cookies from 'js-cookie';
import config from '../../../../build/config.js';
export default {
    name: 'langSwitch',
    data () {
        return {
            lang: 'zh-CN',
            langList: [
                {
                    name: 'zh-CN',
                    text: '中文简体'
                },
                {
                    name: 'en-US',
                    text: 'English'
                }
            ]
        };
    },
    methods: {
        handleSwitch (lang) {
            this.lang = lang;
            localStorage.lang = lang;
            this.$store.commit('switchLang', lang); // 如果你要自己实现多语言切换，那么只需要执行这行代码即可，修改语言类型
        }
    },
    created () {
        this.lang = localStorage.lang || 'zh-CN';
    }
};
</script>